<template>
	<view class="container">
		<u-toast ref="uToast" />
		<u-navbar :is-back="true" title="校园报修" back-icon-color='#333333' height="50" :border-bottom="false">
		</u-navbar>
		<u-tabs name="cate_name" bar-width="110" font-size="24" count="cate_count" :list="building" :is-scroll="true"
			height="65" active-color="#2C7CFE" inactive-color="#999999" bg-color="#fff" :current="current"
			@change="change"></u-tabs>
		<view class="" style="width: 100%; height: 1rpx;border-bottom: 1rpx solid #F2F2F2;">
		</view>
		<view class="grade_list">
			<view class="grade">
				<view class="grade_line" v-for="(item,index) in address_list[current].children" :key="index"
					@click="change_sub(index)"
					:id="[index==num&&num!=address_list[current].children.length-1?'sub':index==num&&num==address_list[current].children.length-1?'active':'']"
					:class="[num==address_list[current].children.length-1&&address_list[current].children.length>1?'active':'']">
					{{item.label}}
				</view>
			</view>
			<view id="teacher">
				<view class="all_teacher" v-for="(i,j) in roomList" :key="j" @click="change_teacher(num,j)">
					<text>{{i.label}}</text>
					<text class="iconfont icon-duigou" style="color:#2f96fe;font-size:30rpx;" v-show="i.boolen"></text>
				</view>
			</view>
		</view>
		<view class="check">
			<image :src="imgUrl" mode="widthFix" @click.stop="select_building"></image>
			<text @click.stop="select_building">全选</text>
			<text @click.stop="reset_data">重置</text>
		</view>
		<view class="confirm">
			<view class="cancel">
				{{cancel}}
			</view>
			<view class="verify" @click="navigate_path">
				{{verify}}
			</view>
		</view>
	</view>
</template>

<script>
	import request from '../../request.js'
	export default {
		data() {
			return {
				activeIndex: 0,
				cancel: '取消',
				verify: '确认',
				building: [],
				maintenance_id: '',
				num: 0,
				imgUrl: '../../static/tupian112.png',
				current: 0,
				select_room: [],
				maintenance_obj: {},
				select_room_name: [],
				address_list: [{
					label: '',
					value: '',
					children: [{
						value: '',
						label: '',
						children: [{
							value: '',
							label: '',
							boolen: '',

						}]
					}]
				}],
			}
		},
		onLoad(option) {
			this.buildingLists();
			if (option.obj) {
				this.maintenance_obj = option.obj;
				console.log(this.maintenance_obj);
				let str = '';
				if (this.maintenance_obj) {
					console.log(123)
					str = this.maintenance_obj[0].building_id;
					console.log('调用了吗555', this.address_list)
					for (let i = 0; i < this.address_list.length; i++) {
						console.log('进来了吗')
						if (str == this.address_list[i].value) {
							console.log(str)
							this.current = i;
							console.log(this.current);
						}
					}
					for (let j = 0; j < this.maintenance_obj.length; j++) {
						for (let k = 0; k < this.address_list.length; k++) {
							if (this.maintenance_obj[j].building_id == this.address_list[k].value) {
								for (let m = 0; m < this.address_list[k].children.length; m++) {
									if (this.maintenance_obj[j].floor_id == this.address_list[k].children[m].value) {
										for (let n = 0; n < this.address_list[k].children[m].children.length; n++) {
											if (this.maintenance_obj[j].room_id == this.address_list[k].children[m]
												.children[n].value) {

												this.address_list[k].children[m].children[n].boolen = true;
												console.log('执行了最后一步', this.address_list[k].children[m].children[n]
													.boolen);
											}

										}
									}

								}

							}

						}
					}
				}



			}
			if (option.id) {
				this.maintenance_id = option.id;

			}
		},
		computed: {
			roomList() {
				if (this.address_list[this.current].children[this.num]) {
					return this.address_list[this.current].children[this.num].children;
				} else {
					return [];
				}
			}
		},
		methods: {
			change(index) {
				console.log(index);
				this.current = index;
				this.num = 0;
			},
			reset_data() {
				this.num = 0;
				this.current = 0;
				this.imgUrl = '../../static/tupian112.png';
				for (let i = 0; i < this.address_list.length; i++) {
					for (let j = 0; j < this.address_list[i].children.length; j++) {
						for (let k = 0; k < this.address_list[i].children[j].children.length; k++) {
							this.address_list[i].children[j].children[k].boolen = false;
						}
					}
				}
			},
			navigate_path() {
				let str = '';
				let room_address = '';
				this.select_room = [];
				this.select_room_name = [];
				for (let i = 0; i < this.address_list.length; i++) {
					for (let j = 0; j < this.address_list[i].children.length; j++) {
						for (let k = 0; k < this.address_list[i].children[j].children.length; k++) {
							if (this.address_list[i].children[j].children[k].boolen) {
								this.select_room.push(this.address_list[i].children[j].children[k].value);
								this.select_room_name.push(this.address_list[i].children[j].children[k].label);
							}
						}
					}
				}
				str = this.select_room.join(',');
				room_address = this.select_room_name.join(',');
				console.log(str);
				if (this.maintenance_id) {
					this.$toLink('../add_maintenance/add_maintenance', {
						id: str,
						address: room_address,
						repairId: this.maintenance_id,
					});
				} else {
					this.$toLink('../add_maintenance/add_maintenance', {
						id: str,
						address: room_address,
					});
				}

			},
			change_sub(param) {
				this.num = param;
				console.log(this.num);
			},
			change_teacher(param1, param2) {
				this.address_list[this.current].children[param1].children[param2].boolen = !this.address_list[this.current]
					.children[
						param1].children[param2].boolen;
			},
			select_building() {
				if (this.imgUrl == '../../static/tupian113.png') {
					this.imgUrl = '../../static/tupian112.png';
					if (this.address_list[this.current].children[this.num]) {
						for (let i = 0; i < this.address_list[this.current].children[this.num].children.length; i++) {
							this.address_list[this.current].children[this.num].children[i].boolen = false;
						}
					}
				} else {
					this.imgUrl = '../../static/tupian113.png';
					if (this.address_list[this.current].children[this.num]) {
						for (let i = 0; i < this.address_list[this.current].children[this.num].children.length; i++) {
							this.address_list[this.current].children[this.num].children[i].boolen = true;
						}
					}
				}
			},
			buildingLists() {
				let base_url = uni.getStorageSync('host');
				console.log(base_url);
				let _this = this;
				request({
					url: base_url + 'teacher/general/buildingLists',
					method: 'post',
					success(res) {
						if (res.statusCode == 200) {
							console.log(res.data.data);
							res.data.data.forEach((item, index) => {
								_this.address_list.push({
									label: item.name,
									value: item.building_id,
									children: [],
								})
								_this.building.push({
									name: item.name
								})
								_this.floorLists(item.building_id, index);

							})
							_this.address_list.shift();
							console.log(_this.address_list);

						} else {
							_this.$refs.uToast.show({
								title: res.data.message || '系统错误',
								type: 'warning',
							})
						}

					}
				})
			},
			floorLists(param, param2) {
				let base_url = uni.getStorageSync('host');
				console.log(base_url);
				let building_id = param;
				let indexes = param2;
				let _this = this;
				request({
					url: base_url + 'teacher/general/floorLists',
					method: 'post',
					data: {
						building_id: building_id
					},
					success(res) {
						if (res.statusCode == 200) {
							console.log(res.data.data);
							res.data.data.forEach((item, index) => {
								_this.address_list[param2].children.push({
									label: item.name,
									value: item.floor_id,
									children: [],
								})
								_this.roomLists(building_id, indexes, item.floor_id, index);
							})
						} else {
							_this.$refs.uToast.show({
								title: res.data.message || '系统错误',
								type: 'warning',
							})
						}

					}
				})
			},
			roomLists(param1, param2, param3, param4) {
				let base_url = uni.getStorageSync('host');
				console.log(base_url);
				let _this = this;
				request({
					url: base_url + 'teacher/general/roomLists',
					method: 'post',
					data: {
						building_id: param1,
						floor_id: param3
					},
					success(res) {
						if (res.statusCode == 200) {
							console.log(res.data.data);
							res.data.data.forEach(item => {
								if (_this.address_list[param2].children[param4]) {
									_this.address_list[param2].children[param4].children.push({
										label: item.name,
										value: item.room_id,
										boolen: false,
									})
								}
							})
						} else {
							_this.$refs.uToast.show({
								title: res.data.message || '系统错误',
								type: 'warning',
							})
						}

					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.container {
		width: 100%;
		overflow: hidden;
		height: 100vh;
		background: #F2F2F2;

		.grade_list {
			width: 100%;
			display: flex;
			justify-content: flex-start;
			background: #fff;
			border-bottom: 1rpx solid #e5e5e5 !important;

			.grade {
				width: 226rpx;

				#sub {
					width: 100%;
					height: 79rpx;
					background-color: #fff;
					line-height: 79rpx;
					text-indent: 1em;
					border-bottom: 1rpx solid #e5e5e5;
					border-right: none;
					color: #2f96fe;
					box-sizing: border-box;
					font-size: 30rpx;
				}

				#active {
					width: 100%;
					height: 79rpx;
					background-color: #fff;
					line-height: 79rpx;
					text-indent: 1em;
					border-bottom: 1rpx solid #e5e5e5 !important;
					border-right: none;
					color: #2f96fe;
					box-sizing: border-box;
					font-size: 30rpx;
				}



				.grade_line {
					width: 100%;
					height: 79rpx;
					background-color: #f9f8f8;
					line-height: 79rpx;
					text-indent: 1em;
					border-bottom: 1rpx solid #e5e5e5 !important;
					border-right: 1rpx solid #e5e5e5;
					color: #666666;
					box-sizing: border-box;
					font-size: 30rpx;

					&:last-child {
						border-bottom: none;
					}
				}

				.active {
					border-bottom: none !important;
				}
			}

			#teacher {
				width: 524rpx;

				.all_teacher {
					width: 100%;
					height: 79rpx;
					line-height: 79rpx;
					background: #fff;
					box-sizing: border-box;
					border-bottom: 1rpx solid #e5e5e5 !important;
					text-indent: 1em;
					display: flex;
					justify-content: flex-start;
					color: #666666;
					font-size: 26rpx;

					text {
						&:nth-child(1) {
							font-size: 26rpx;
							margin-left: 8rpx;
							width: 248rpx;
						}

						&:nth-child(2) {
							margin-left: 115rpx;

						}
					}

					&:last-child {
						border-bottom: none;
					}
				}

			}
		}


		.check {
			width: 100%;
			height: 88rpx;
			display: flex;
			justify-content: flex-start;
			align-items: center;
			background: #fff;

			image {
				&:nth-child(1) {
					width: 40rpx;
					margin-left: 20rpx;
				}
			}

			text {
				font-size: 24rpx;
				color: #666666;

				&:nth-child(2) {
					width: 200rpx;
					margin-left: 20rpx;

				}

				&:nth-child(3) {
					margin-left: 380rpx;
				}
			}

		}

		.confirm {
			width: 100%;
			height: 400rpx;
			display: flex;
			justify-content: space-around;
			align-items: center;

			.verify {
				width: 200rpx;
				height: 60rpx;
				border-radius: 50rpx;
				text-align: center;
				line-height: 60rpx;
				background: linear-gradient(to right, #2C78FE, #32B0FF);
				color: #fff;
				font-size: 30rpx;
			}

			.cancel {
				width: 200rpx;
				height: 60rpx;
				border-radius: 50rpx;
				text-align: center;
				line-height: 60rpx;
				background: #fff;
				color: #666666;
				font-size: 30rpx;
			}
		}
	}
</style>
